<template>
  <div v-for="i in authActionStore.authActionList" :key="i.id" class="mb-2">
    <Tag
      severity="danger"
      value="删除"
      class="mr-2 cursor-pointer"
      @click="(event) => handleDelete(event, i)"
    ></Tag>
    <Tag severity="info" :value="i.method" class="mr-2"></Tag>
    <span>{{ i.api }}</span>
  </div>
  <ConfirmPopup />
</template>

<script setup lang="ts">
import { ref } from "vue";
import { ConfirmPopup, Tag, useConfirm } from "@/utils/primevue";
import { useField, useForm } from "vee-validate";
import { useToast } from "vue-toastification";
import { useAuthActionStore } from "@/stores/authAction";
import type { TAuthActionItem } from "@/typing/authAction";

const { handleSubmit } = useForm();
const authActionStore = useAuthActionStore();
const toast = useToast();
const confirm = useConfirm();

const props = defineProps<{
  businessKey: string;
}>();

const handleDelete = (event: any, item: TAuthActionItem) => {
  confirm.require({
    target: event.currentTarget,
    message: "你想要删除这条记录吗?",
    icon: "pi pi-info-circle",
    acceptClass: "p-button-danger",
    accept: () => {
      authActionStore.deleteAuthAction(item.id + "", () => {
        toast.success("删除数据成功～");
        authActionStore.queryAuthActionList(props.businessKey, { force: true });
      });
    },
    reject: () => {
      toast.info("取消删除数据成功～");
    },
  });
};
</script>

<style lang="less" scoped></style>
